import Dep from './dep.js'

export default class Observer {
  constructor (data) {
    this.walk(data)
  }

  walk (data) {
    if (!data || typeof data !== 'object') return
    Object.keys(data).forEach(key => {
      this.defineReactive(data, key, data[key])
    })
  }

  defineReactive (data, key, value) {
    const self = this
    // 属性为对象，将属性的值也做响应式处理
    this.walk(data[key])

    // 为当前 key 创建 dep
    const dep = new Dep()

    Object.defineProperty(data, key, {
      enumerable: true,
      configurable: true,
      get () {
        // 将用到此 key 的 watcher 添加到 dep 中
        dep.depend()
        return value
      },
      set (newValue) {
        if (newValue !== value) {
          value = newValue

          // 若新值为 object，为其添加响应式
          self.walk(newValue)

          // 值变化时发出通知，更新视图
          dep.notify()
        }
      }
    })
  }
}
